<link rel="stylesheet" media="screen" href="<?=$this->url;?>css/ui-lightness/jquery-ui-1.8.20.custom.css"/>
<link rel="stylesheet" media="screen" href="<?=$this->url;?>css/ui.jqgrid.css"/>

<script src="<?=$this->url?>js/jquery-ui-1.8.20.custom.min.js" type="text/javascript"></script>

<script src="<?=$this->url?>js/grid.locale-es.js" type="text/javascript"></script>
<script type="text/javascript">
    $.jgrid.no_legacy_api = true;
    $.jgrid.useJSON = true;
</script>
<script src="<?=$this->url?>js/jquery.jqGrid.min.js" type="text/javascript"></script>



<script type="text/javascript">
    $(document).ready(function () {
        jQuery("#list4").jqGrid({
            url:'<?=$this->url(array('controller' => $this->controller, 'action' => 'list'))?>',
            datatype:"json",
            height:'100%',
            width:'100%',
            colNames:colNames,
            colModel:colModel,
            rowNum:20,
            rowList:[20, 50, 100],
            pager:'#pager2',
            sortname:'id',
            viewrecords:true,
            sortorder:"desc",
            jsonReader:{
                repeatitems:false,
                id:"0"
            },
            caption:"Wec"
        });

        jQuery("#list4").jqGrid('navGrid', '#pager2',
            {edit:false, add:false, del:false},
            {},
            {},
            {},
            {multipleSearch:true, multipleGroup:true}
        );

    });

</script>

<table id="list4"></table>
<div id="pager2"></div>